<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="https://www.hualigs.cn/image/606437269af98.jpg">
    <link rel="stylesheet" type="text/css" href="style.css">
    <title>第八次作业</title>
</head>
<body>
    <style>
        .biaoti{
            font-size: 18px;
            font-family: SimHei;    
            font-weight: 1000;
        }
    </style>
    <img width="110%" height="110%" src="https://www.hualigs.cn/image/606437b1999af.jpg" style="position:absolute; left:0; top:0; z-index:-1;"/>
    <div id="right_article" style=" margin-top: 10px;margin-right: 150px;text-align: right;">
        <h1 style="font-size: 24px;font-family: 隶书;">
            实验八 CSS基本选择器
        </h1>
    </div>
    <div class="article" >
        <div class="warning">
            注意：本试验指导文件即为<a href="#" style="color: rgb(117, 154, 114);" onclick="alert('其实就是我自己')">实验8 CSS基本选择器.html</a>，以下实验项目均以本文件为操作对象。另除本行外，本网页中 其它超链接均为红色。
        </div>
        <div class="biaoti">
            一 实验目的
        </div>
        <div class="symd">
            <i>
                <ol style="margin-left: 50px;margin-top: 15px;">
                    <li>掌握CSS样式的语法规则 ；</li>
                    <li>掌握CSS样式的基本选择器的使用 ；</li>
                    <li>掌握CSS样式表的定义位置 ；</li>
                    <li>重点培养应用CSS样式的能力。</li>
                </ol>
            </i>
        </div>
        <div class="biaoti">
                二 实验内容
        </div>
        <div class="article_2">
            <p>
                1.使用<a href="https://www.w3cschool.cn/eyv2f3/wydv1qbh.html">行内样式表</a>修饰本页面中的第一行的文字为h1、居中、隶书，加粗，24px；<br>
                2. 使用嵌入样式表，创建一个名为biaoti的类选择器将本网页中所有二级标题（如“实验目的”等）变成黑体、18px、加粗；<br>
                *3-8项要求请使用导入样式表文件“<a href="style.css">学号姓名实验8 CSS基本选择器.css</a>”。<br>
                3.创建一个symd类用以修饰“实验目的”中的文字为斜体，微软雅黑，20px，白色，加粗，且背景为浅蓝色；<br>
                4.所有的超链接是绿色；<br>
                5.所有“实验内容”中的<a href="https://baike.baidu.com/item/%E8%B6%85%E9%93%BE%E6%8E%A5/97857?fr=aladdin">超链接</a>是红色、20px；<br>
                6.给网页加上背景；<br>
                7.“实验内容”中行间距20px，文字15px，字间距5px；<br>
                8.请下面的诗《临洞庭上张丞相》变成竖排的古文风格。
            </p>
        </div>
        <div class="poetry">
            <table style="margin-top: 10px;">
                <tr>
                    <td class="poem"><span>坐观垂钓者，</span></td>
                    <td class="poem"><span>欲济无舟楫，</span></td>  
                    <td class="poem"><span>气蒸云梦泽，</span></td>
                    <td class="poem"><span>八月湖水平，</span></td>   
                    <td class="poem" style="padding-left: 80px;padding-top: 15px;"><span>临洞庭上张丞相</span></td>              
                </tr>
                <tr>
                    <td class="poem"><span>徒有羡鱼情</span></td>
                    <td class="poem"><span>端居耻圣明</span></td>
                    <td class="poem"><span>波撼岳阳城</span></td>
                    <td class="poem"><span>涵虚混太清</span></td>
                    <td class="poem" style="padding-left: 30px;"><span>唐·孟浩然</span></td> 
                </tr>
            </table>
        </div>
        <div class="notes">
            说明：文本书写顺序属性writing-mode:tb-rl。
        </div>
    </div>
</body>
</html>